<%-- 
    Document   : questionMgmt.jsp
    Created on : Dec 13, 2011, 5:04:13 PM
    Author     : Randy
--%>

<%@page import="java.util.HashMap"%>
<%@page import="model.Question"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Question Management</title>
        <%@include file = "global/admin_include.jsp" %>
        <%
            HashMap am = new HashMap();
            Object obj = request.getSession().getAttribute("accessMap");
            if (obj == null) {
                response.sendRedirect("../admin.jsp");
            } else {

                am = (HashMap) obj;
                if (am.get("Q").equals("false")) {
                    response.sendRedirect("accessDenied.jsp");
                }
            }  
        %>
        <script type="text/javascript">
            $(document).ready(function(){
                getThemes();
                
                $('#dd').dialog({modal:true});
                $('#dd').dialog('close');
                
                $('#tt').datagrid({
                    onBeforeEdit:function(index,row){  
                        row.editing = true;  
                        updateActions();  
                    },  
                    onAfterEdit:function(index,row){
                        if (row.question == ""){
                            alertMsgStr("Edit Question", "All fields are required", "error");
                            $('#tt').datagrid('beginEdit', index);
                        } else {
                            row.editing = false;
                            $.ajax({
                                type: "POST",
                                url: "../QuestionServlet",
                                data: "action=updateQuestion"
                                    + "&qns_id=" + row.qns_id
                                    + "&question=" + row.question
                                    + "&status=" + row.status,
                                dataType: "json",
                                cache: false,
                                success: function(data){
                                    if((data.type!='error')){
                                        $('#tt').datagrid('reload');
                                    }
                                    alertMsg(data);
                                }
                            });
                            updateActions();  
                        }
                    },  
                    onCancelEdit:function(index,row){  
                        $('#tt').datagrid('reload'); 
                    }
                });
            });
            
            function getThemes(){
                $.ajax({
                    type: "POST",
                    url: "../ThemeServlet",
                    data: "action=getThemes&industry=<%=request.getParameter("industry")%>",
                    dataType: "xml",
                    cache: false,
                    success: function(data){
                        $('#theme_id').append('<option value=\'\'></option>');
                        $('#theme').append('<option value=\'\'></option>');
                        $(data).find('theme').each(function(){
                            $('#theme_id').append('<option value=\'' + $(this).find('theme_id').text() + '\'>' + $(this).find('theme_name').text() + '</option>');
                            $('#theme').append('<option value=\'' + $(this).find('theme_id').text() + '\'>' + $(this).find('theme_name').text() + '</option>');
                        });
                    }
                });
            }
            
            $(function() {
                $('#theme_id').change(function() {
                    $('#tt').datagrid({  
                        url:'../QuestionServlet?action=getQuestions&theme_id=' + $("#theme_id :selected").val()
                    });
                });
            });
            
            function formatActions(value,row,index){ 
                if (row.editing) {  
                    var s = '<input type="button" onclick="saverow('+index+')" value="Save"/> ';  
                    var c = '<input type="button" onclick="cancelrow('+index+')" value="Cancel"/>';  
                    return s+c;  
                } else {  
                    var e = '<input type="button" onclick="editrow('+index+')" value="Edit"/> ';
                    return e;  
                }
            }
            
            function editrow(index){  
                $('#tt').datagrid('beginEdit', index);  
            }  
             
            function saverow(index){  
                $('#tt').datagrid('endEdit', index);  
            }
            
            function cancelrow(index){  
                $('#tt').datagrid('cancelEdit', index);  
            }
            
            function updateActions(){  
                var rowcount = $('#tt').datagrid('getRows').length;  
                for(var i=0; i<rowcount; i++){ 
                    $('#tt').datagrid('updateRow',{index:i,row:{actions:''}});  
                }  
            }
            
            function openDD(){
                $('#theme').val("");
                $('#question').val("");
                $('#dd').dialog('open');
            }
            
            function closeDD(){
                $('#dd').dialog('close');
            }
            
            function createQuestion(){
                var theme = $("#theme :selected").val();
                var question = $("#question").val();
                
                if (theme == "" || question == "") {
                    alertMsgStr("New Question", "All fields are required", "error");
                } else {
                    $.ajax({
                        type: "POST",
                        url: "../QuestionServlet",
                        data: "action=createQuestion&theme=" + theme + "&question=" + question,
                        dataType: "json",
                        cache: false,
                        success: function(data){
                            if((data.type!='error')){
                                $("#theme_id").val(theme);
                                $('#dd').dialog('close');
                                $('#tt').datagrid('reload');
                            }
                            alertMsg(data);
                        }
                    });
                }
            }
        </script>
    </head>
    <body>
        <div style="border-bottom:1px solid #ccc"><h2>Question Management</h2></div> 
        <br/>
        <div id="tb" style="padding:5px;height:auto">
            <table width="100%">
                <tr>
                    <td width="80%">Theme: <select name="theme_id" id="theme_id"></select></td>
                    <td width="20%" align="right"><input type="button" value="New Question" onclick="openDD()"/></td>
                </tr>
            </table>
        </div>  
        <div style="height:450px">
            <table id="tt" class="easyui-datagrid" fit="true"
                   toolbar="#tb"
                   singleSelect="true" fitColumns="true" pagination="false"
                   rownumbers="false">
                <thead>  
                    <tr>
                        <th field="qns_id" width="5%">ID</th>
                        <th field="question" editor="{type:'text'}" width="75%">Question</th>
                        <th field="status" editor="{
                            type:'checkbox',
                            options:{on: '<%=Question.QuestionStatus.Active.name()%>',off: '<%=Question.QuestionStatus.Inactive.name()%>'}
                            }" width="5%" align="center">Status</th>
                        <th field="actions" width="15%" align="center" formatter="formatActions"></th>
                    </tr>  
                </thead>  
            </table> 
        </div>
        <div id="dd" title="New Question" style="width:425px; height:240px">
            <table>
                <tr>
                    <td colspan="2"><font color="red">All fields are required</font><br/><br/></td>
                </tr>
                <tr>
                    <td>Theme:</td>
                    <td><select name="theme" id="theme"></select></td>
                </tr>
                <tr>
                    <td>Question:</td>
                    <td><textarea id="question" name="question" rows="4" cols="40"></textarea></td>
                </tr>                 
                <tr>
                    <td colspan="2" align="center">
                        <br/>
                        <input type="button" value="Create" onclick="createQuestion()"/>
                        <input type="button" value="Cancel" onclick="closeDD()"/>
                    </td>
                </tr>
            </table> 
        </div>
    </body>
</html>
